<style lang="less" scoped>
.banner {
    width: 100%;
    height: 250px;
    >swiper{
        width: 100%;
        height: 100%;
    }
    .slide-image{
        width: 100%;
        height: 100%;
    }
}
</style>
<template>
    <div class="banner">
        <swiper :autoplay="autoplay"  :interval="interval" :indicator-dots="indicatorDots" >
            <block v-for="(item, index) in list" :key="index">
                <swiper-item>
                    <img :src="item" class="slide-image"  />
                </swiper-item>
            </block>
        </swiper>
    </div>
</template>
<script>
export default {
  props: {
    // 图片个数  
    list: {
        type: Array,
        default: "",
        required: true
    },
    // 是否自动切换
    autoplay:{
        type: Boolean,
        default: true,
        required: false
    },
    // 自动切换时间间隔
    interval: {
        type: Number,
        default: 2000,
        required: false
    },
    // 是否显示面板指示点
    indicatorDots: {
        type: Boolean,
        default: true,
        required: false
    }
    
  },
  data() {
      return {
            
      }
  }
};
</script>


